<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr"><head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Epreuve - Interface du concours des Open du Web</title>
    <link rel="stylesheet" type="text/css" href="29_fichiers/css.css" media="screen">
<link rel="stylesheet" type="text/css" href="29_fichiers/css_002.css" media="screen">
<link rel="stylesheet" type="text/css" href="29_fichiers/css_005.css" media="screen">
<link rel="stylesheet" type="text/css" href="29_fichiers/css_004.css" media="screen">
<link rel="stylesheet" type="text/css" href="29_fichiers/css_003.css" media="print">
    <meta name="description" content="Open du Web">
    	<link rel="shortcut icon" type="image/x-icon" href="http://concours.open-du-web.fr/images/favicon.png">
	    <script type="text/javascript">
    var baseUrl = 'http://concours.open-du-web.fr';
    var module = 'epreuves';
    var reqvars = 'epreuves/epreuve/29';
    var finChronoInterface = 'December 06, 2012 21:14:06';
    var finChronoInterfaceJury = 'December 06, 2012 22:14:06';
    </script>
    <script type="text/javascript" src="29_fichiers/js.php"></script>
<script type="text/javascript" src="29_fichiers/js_003.php"></script>
<script type="text/javascript" src="29_fichiers/js_002.php"></script>


    <script type="text/javascript" src="29_fichiers/jquery.js"></script>
    <link rel="shortcut icon" href="http://concours.open-du-web.fr/images/odw.ico">
    </head>
        <body id="body" class="">
    <div id="page">
    <div id="header">
        <h1>
            <a href="http://concours.open-du-web.fr/" class="header_left"><img src="29_fichiers/logo.png" alt="Interface du concours des Open du Web"></a>
            <a href="http://www.les-argonautes.fr/" class="header_right">Sponsor du concours : <img src="29_fichiers/logo_argonautes.png" alt="Les Argonautes"></a>
            <span class="header_center">Interface du concours des Open du Web</span>
        </h1>
    </div>

    <div id="container">
        <ul id="nav">
		<li><a href="http://concours.open-du-web.fr/epreuves">Tableau des épreuves</a></li>
		<li class="right">
	    Bienvenue Raphy !
	    <a href="http://concours.open-du-web.fr/epreuves/epreuve/29?logout=1" class="btn">Déconnexion</a>
	</li>
	    </ul>

<script type="text/javascript">
    $(document).ready(function(){
        var start = 1354814560*1000 ;
    });
</script>

<div class="clear"></div>


<ul id="bandeau">
    <li>
        <p>
            Participant :
            <span>
                Raphy                (EpiLiWeb)            </span>
        </p>
    </li>
    
    <li>
        <p>
            Épreuve en cours : 
                                <span>
                        Webdesign n° 1                    </span>
                    </p>
    </li>
    
    <li>
        <p>
            Temps passé sur l'épreuve en cours : 
                                <span id="timer">00 : 08 : 31</span>
                    </p>
    </li>
    
    <li>
        <p>
            Temps restant :
            <span class="countdown">02 : 42 : 54</span>
        </p>
    </li>
</ul>

    <script type="text/javascript">
        var startTime = 0;
        var end = 0;
        var diff = 0;
        var reset = false;
        var timerID = 0;
        var start = 1354814560*1000 ;
        
        $(document).ready(function(){
            $("#stop").hide();
            chronoStart();

        });

        function chrono(){
            end = new Date();
            diff = end - start;
            diff = new Date(diff);
            var sec = diff.getSeconds();
            var min = diff.getMinutes();
            var hr = diff.getHours()-1;

            if (sec < 10){
                sec = "0" + sec;
            }
            
            if (min < 10){
                min = "0" + min;
            }
            
            if (hr < 10){
                hr = "0" + hr;
            }
            
            $("#timer").html(hr+" : "+min+" : "+sec);
        }

        function chronoStart(){
            $(".tog").toggle();
            //start = new Date(1354814560*1000 );
            timerID = setInterval(chrono, 500);
        }
    </script>

<div id="content">
    <h2>
        <span>
            Catégorie Webdesign        </span>
        - Épreuve n° 1
            </h2>

    <div id="consignes">
                        <h3>Présentation des épreuves</h3>
                <p class="margebott">
                    <a href="http://concours.open-du-web.fr/popin/epreuves-webdesign" class="btnserver popin">Voir la présentation générale</a>
                </p>
        
        <h3>Consignes</h3>

        <div class="laConsigne">
                        <h4>Présentation des épreuves</h4>

<p>L’objectif de l’ensemble des épreuves de web design est de réaliser 
la page d’accueil d’une agence de voyage un peu particulière.</p>

<p>Vous aurez le choix entre quatre agences proposant des destinations 
bien différentes. Chaque domaine obéit à certains codes graphiques et 
doit viser une cible particulière.</p>

<p>Vous devrez conserver l’agence choisie de la première à la dernière 
épreuve.
À la fin de chaque épreuve, les rendus doivent être argumentés par écrit
 dans la zone réservée de l’interface. Vous pouvez aussi venir compléter
 votre argumentation à l’oral auprès du jury. Si votre argumentation 
(écrite ou orale) est jugée pertinente, vous remporterez des points 
bonus !</p>

<p>Vous avez à votre disposition des images d’inspiration ainsi que des 
photos libres de droits. Vous pouvez utiliser d’autres images que celles
 proposées à condition qu’elles soient libres de droit.<br>
<br>
<b>La page d’accueil doit avoir le même gabarit que les autres pages du site.</b></p>
<br><br>

<h4>Les objectifs du site</h4>
<ul>
<li>Inciter l’internaute à la découverte de l’offre</li>
<li>Proposer les dernières actualités</li>
<li>Hiérarchiser le contenu</li>
<li>Identifier rapidement le domaine de l’agence</li>
</ul>
<br><br>

<h4>Éléments à faire figurer obligatoirement sur la page d’accueil</h4>
<ul>
<li>Logo</li>
<li>Header</li>
<li>Footer</li>
<li>Eléments call to action</li>
</ul>

<p>Il est bien entendu possible de faire figurer des éléments qui ne sont pas listés ci-dessus.</p>
<br><br>

<h4>Livrables</h4>

<p>Pour toutes les épreuves il faudra fournir les fichiers (psd, ai, pdf) ainsi que les éventuelles polices utilisées.</p>
<br><br>


<h4>Les agences</h4>

<h5>Voyage dans le temps : Flashback Travel</h5>
<p>Vous avez toujours rêvé d’assister à la construction des pyramides ? 
D’arpenter les rues du vieux Londres à la recherche de Jack l'éventreur ?
 De participer aux batailles héroïques du temps des chevaliers ou encore
 de revenir 10 minutes avant d’avoir dit cette énorme boulette face à 
votre ex-nouvel employeur ? Flashback Travel vous enverra au beau milieu
 de votre époque rêvée. Ne perdez pas de temps !<br>
Images à disposition : <a href="http://concours.open-du-web.fr/odw/wd-1/flashback-travel-1zg.zip" target="_blank">flashback-travel.zip</a></p>


<h5>Espace : Captain’ Cosmos</h5>
<p>Prenez de la hauteur ! Traversez notre Voie Lactée ! Explorez les 
univers éloignés ! Aventurez-vous au delà de l’infini !
L’agence Captain’ Cosmos vous accueille à bord d’Atlantis, le vaisseau 
ultramoderne tout confort, pour partir au fin fond de l’univers, à des 
années et des années lumières de la Terre.<br>
Images à disposition : <a href="http://concours.open-du-web.fr/odw/wd-1/captain-cosmos-cde.zip" target="_blank">captain-cosmos.zip</a></p>


<h5>Microscopique : Go Nano</h5>
<p>Partir en vacances : oui, Mais où ?<br>
Chez vous !<br>
C’est ce que propose cette agence japonaise spécialisée dans la 
miniaturisation de vacancier en quête d’aventure d’un nouveau genre.<br>
Découvrez un nouveau monde juste sous votre nez : le monde de l’infiniment petit !<br>
La piscine de votre jardin devient un véritable océan, les puces de 
votre chien vous attaqueront probablement et les miettes de gâteaux sur 
le plancher seront vos seuls repas. Mais quelle experience !<br>
Images à disposition : <a href="http://concours.open-du-web.fr/odw/wd-1/go-nano-6fe.zip" target="_blank">go-nano.zip</a></p>


<h5>Zombie Parc</h5>
<p>Vous vous réveillez dans un endroit inconnu, pas un bruit, pas une 
âme qui vive. Dans la rue déserte, entre les bâtiments en ruines de ce 
décor apocalyptique, une silhouette agarde et chancelante apparaît. 
Courrez ! C’est un zombie ! et il n’est pas seul ! C’est maintenant une 
horde de revenants qui sont à vos trousses ! Soyez le plus astucieux : 
un vieux tuyau, une batte de baseball ou pourquoi pas une poêle à frire 
seront vos meilleures armes pour venir à bout de ces morts vivants. 
Survivez pendant 48h et repartez avec une compilation vidéo de vos plus 
belle actions grâce aux nombreuses caméras de surveillances placées un 
peu partout dans la ville !<br>
Promotion exceptionnelle : si vous échouez à échapper aux zombies et 
n’arrivez pas à revenir, l’agence vous rembourse la moitié du voyage ! 
Elle est pas belle la vie ?<br>
Images à disposition : <a href="http://concours.open-du-web.fr/odw/wd-1/zombie-parc-d7c.zip" target="_blank">zombie-parc.zip</a></p>
<br><br>


<h4>Structuration des épreuves</h4>
Les 4 épreuves de web design sont les suivantes :
<ol>
<li>Logo</li>
<li>Moodboard</li>
<li>Maquette 1/2</li>
<li>Maquette 2/2</li>
</ol>

<p>C’est parti !</p>

<p>Pour cette première épreuve, vous devez concevoir et réaliser le logo de l’agence choisie.</p>

<p>La création graphique doit être argumentée à l’écrit lors de la remise du fichier.</p>        </div>


        <div class="left epreuveDetail">
            <h3 class="margintop">Critères de validation</h3>
            <ul>
                                <li>Le logo doit respecter les codes graphiques du domaine</li>
                                <li>Le graphisme global suit les tendances actuelles</li>
                                <li>L’argumentaire est clair et convainquant</li>
                        </ul>

            <h3 class="margintop">Bonus de l'épreuve (+2W)</h3>

            <ul>
                                        <li>Le logo est réalisé en vectoriel</li>
                                        <li>La création graphique est déclinable sur d’autres supports</li>
                                        <li>Argumentation orale pertinente complétant l’argumentation écrite</li>
                                        <li>L’organisation des fichiers sources (calques, groupes, etc.) est claire</li>
                                        <li>Mention spéciale du jury</li>
                            </ul>

            <!--<h3 class="margintop">Mentions possibles dans cette catégorie (+1W)</h3>

            <ul>
                                    <li>Il n'y a pas de mentions pour cette catégorie.</li>
                            </ul>-->
        </div>
    </div>
    
        <div class="right epreuveDetail">
                <h3>Envoyer au jury</h3>
            <p class="title">Terminé ? Allez, on envoie au jury pour validation !</p>

            <form action="http://concours.open-du-web.fr/epreuves/epreuve/29" method="POST" id="sendReponse" enctype="multipart/form-data">
                            <input name="fileReponse" id="fileReponse" type="file">
                <span class="legend">(fichiers ZIP acceptés)</span>

                <p class="accepted marginbottom">
                    <a href="http://concours.open-du-web.fr/popin/formats-acceptes" class="popin">Voir les formats acceptés</a>
                </p>

                <label for="commentaires">
                    <strong>Précisions pour le jury (facultatif)</strong>
                </label>

                <p>
                    <textarea name="commentaires" id="commentaires"></textarea>
                </p>

                <p class="center">
                    <input value="Envoyer !" class="btn" name="submitEpreuve" type="submit">
                </p>

                <p class="center margintop">
                    <input value="abandonner l'épreuve" name="giveup" id="giveup" type="button">
                    <br>Attention, si tu abandonnes l'épreuve, le score pour cette épreuve sera de -1W.
                </p>
            </form>
        </div>
    
    <div class="clear"></div>
</div>

<script type="text/javascript">
$(document).ready(function(){
    $('#sendReponse').submit(function(e, giveup){
        if( $('#fileReponse').val() == '' && giveup != 'giveup' ){
            if(!confirm( 'Es-tu sûr de ne pas vouloir envoyer un fichier ?' )){
                return false;
            }
        }
    });

    $('#giveup').click( function(){
        if( confirm( 'Es tu sûr de vouloir abandonner cette épreuve ?' )){
            $('#sendReponse').append('<input type="hidden" name="giveup" value="1" />').trigger('submit',['giveup']);
        }
    });
});
</script>


    </div>
</div>
<div id="footer">
    
</div>    <!--
    0,0174    -->
    
        
    
</body></html>